<%@page contentType="text/html;charset=utf-8"%>
<%@ taglib prefix="cw" uri="/widget-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>三级联动下拉框示例</title>
		<cw:base />
		<script>
        var fields=['id','code','name'];
    </script>
	</head>
	<body>
		<li>
			<b>展现一个三级联动的示例 </b>
		</li>
		<li>
			<b>数据源为字典数据，通过parentField设置上级的id </b>
		</li>
		<br>
		<br>
		<cw:form id="form" ajax="true" url="../../../../sample/form/submitFormWithLinkage3Level.action" waitMsg="提交中...">
			<table width="300">
				<tr>
					<td>
						所属行政区划：
						<cw:linkage id="first" property="district" url="../../../..//sample/form/loadCodeInfo.action" emptyItem="true"
							emptyItemText="请选择..." />
					</td>
				</tr>
				<tr>
					<td>
						所属区县：
						<cw:linkage id="second" property="county" fields="fields" url="../../../../sample/form/loadCodeInfo.action"
							emptyItem="true" emptyItemText="请选择..." displayField="name" valueField="code" parentField="first" />
					</td>
				</tr>
				<tr>
					<td>
						所属街道：
						<cw:linkage id="third" property="street" fields="fields" url="../../../../sample/form/loadCodeInfo.action"
							emptyItem="true" emptyItemText="请选择..." displayField="name" valueField="code" parentField="second" />
					</td>
				</tr>
			</table>
			<li>
				远程加载联动数据
				<table>
					<tr>
						<td>
							<cw:button text="加载数据1" onclick="loadLinkage()"></cw:button>
						</td>
					</tr>
				</table>
			</li>
			<li>
				通过setValue方式加载联动数据
				<table>
					<tr>
						<td>
							<cw:button text="加载数据2" onclick="setValues()"></cw:button>
						</td>
					</tr>
				</table>
			</li>
			<li>
				提交表单
				<table>
					<tr>
						<td>
							<cw:formButton actionType="submit" formId="form" />
						</td>
					</tr>
				</table>
			</li>
		</cw:form>
		<script type="text/javascript">
       function loadLinkage(){
	        Wonders.utils.formLoadLinkage('../../../../sample/form/getCascadeDataWith3Level.action',null,'form','../../../../sample/form/loadLinkageWith3Level.action');  
	     }	
	
	   	 function setValues(){
			   Ext.getCmp('first').setValue('beijing');	
			   Ext.getCmp('second').setValue('haidian');
			   Ext.getCmp('third').setValue('zhongguancun');
		
		   	 Wonders.Combo.loadLinkage('form','first','second','third');
	     }
	</script>
	</body>
</html>
